<template>
  <div>
    <div>第二个页面</div>
    <button @click="addFun">点击添加</button>
    <h1>{{test}}</h1>
  </div>
</template>

<script>

  let aaa = 0;
  export default {
    name: 'firstComp',
    data() {
      return {
        msg: '我是第一个复用组件',
        color: false,
        list: ['张三', '李四', '王五', '不认识'],
        test: ''
      }
    },
    methods: {
      addFun() {
        aaa = aaa + 1
        this.test = this.list[aaa]
      }
    },
    mounted() {
      console.log('aaa', aaa)
    },
    beforeDestroy() {
      console.log('aaa???', aaa)

    },
    computed: {}
  }
</script>

<style scoped>
  .first {
    width: 300px;
    height: 100px;
    background-color: lightskyblue;
  }

  .tow {
    width: 300px;
    height: 100px;
    background-color: red;
  }
</style>
